<!DOCTYPE html>
<html xmlns:javascrip="http://www.w3.org/1999/xhtml">
<head>
    <meta charset="utf-8">
    <title>layui</title>
    <meta name="renderer" content="webkit">
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
    <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
</head>
<style>
    /*媒体查询 小于750 的样式*/
    @media screen and (max-width: 999px) {
        .mid{
            width: 100%;
            text-align: center;
            margin-top: 10px;

        }
        .layui-table-cell{
            /*width: 100%;*/
        }

    }
    @media screen and (min-width: 999px) {
        .layui-table-cell{
            width: calc((100vw *0.7) / 4)!important;
        }

    }

</style>
<body>

<div class="layui-card">
    <div  class="layui-form layui-card-header layuiadmin-card-header-auto">
        <form action="">
            <div class="layui-inline" >
                <label class="layui-form-label">搜索</label>
                <div class="layui-input-inline">
                    <input type="text" id="content"  autocomplete="off" class="layui-input">
                </div>
            </div>
        </form>
    </div>

    <div class="layui-card-body">

            <div class="layui-inline mid">
                <button class="layui-btn add" >
                    新建资源
                </button>
                <button class="layui-btn upload"  id="upload">
                    导入资源
                </button>
                <button class="layui-btn export" >
                    导出All资源
                </button>
                <button class="layui-btn layuiadmin-btn-order" id="search" lay-submit="" lay-filter="LAY-app-order-search">
                    <i class="layui-icon layui-icon-search layuiadmin-button-btn"></i>
                </button>

            </div>

        <table id="demo"  lay-filter="xx">
        </table>
    </div>
</div>
    <script type="text/html" id="barDemo">
        <a class="layui-btn layui-btn-primary layui-btn-xs" lay-event="open"><i class="layui-icon layui-icon-console"></i></a>
    </script>


<script src="/js/include.js" type="text/javascript" charset="utf-8"></script>
<!-- 注意：如果你直接复制所有代码到本地，上述js路径需要改成你本地的 -->
<script>
    //layui 表格
    layui.use('table', function(){
        //表格数据装载
        var table = layui.table;
        table.render({
            id: 'idTest',
            url:'/dbm/resource/list/',
            method:'post',
            where: {resource_name:"resources_info", querydata: JSON.stringify({username:$("#title").val()})},
            page:true,
            limits:[10,20],
            limit:10,
            elem: '#demo', //指定原始表格元素选择器（推荐id选择器）
            height: 515 ,//容器高度
            cols: [[
                    //{ width:'30%', align:'center', toolbar: '#barDemo'},
                {field: 'r_cn_name', title: '中文名称',width:120},
                {field: 'r_name', title: '英文名称',width:120},
                {field: 'r_description', title: '描述',width:120},
                {field: 'create_time', title: '创建时间',width:120},
                {title: '控制台',fixed: 'right', width:80, align:'center', toolbar: '#barDemo'}]], //设置表头
                //]], //设置表头

            response:{
                statusName: 'success', //数据状态的字段名称，默认：code
                statusCode: true ,//成功的状态码，默认：0
                msgName: 'message', //状态信息的字段名称，默认：msg
                countName: 'count', //数据总数的字段名称，默认：count
                dataName: 'data' //数据列表的字段名称，默认：data
            }
            //,…… //更多参数参考右侧目录：基本参数选项
        });
        //监听工具条
        table.on('tool(xx)', function tata(obj){

            var data = obj.data,layEvent = obj.event;
            /*if(layEvent === 'edit'){
                var index = layer.open({
                    title:data.r_cn_name,
                    type: 2,
                    content: '/html/resource/resource_from.html?id='+data.id,
                    area: ['500px', '500px'],
                    maxmin: false
                });

            }else*/ if(layEvent === 'open'){
                var btns=[];
                if(data.r_status == 'wait_issue'){
                    btns=['字段',
                        '<i class="layui-icon layui-icon-release"></i>',
                        '<i class="layui-icon layui-icon-edit"></i>',
                        '<i class="layui-icon layui-icon-delete"></i>'];
                }else if(data.r_status == 'issued'){
                    btns=['字段',
                        '<i class="layui-icon layui-icon-refresh"></i>',
                        '<i class="layui-icon layui-icon-edit"></i>',
                        '<i class="layui-icon layui-icon-delete"></i>',
                        '<i class="layui-icon layui-icon-link"></i>'];
                }else {
                    layer.msg('程序有问题，请联系管理员');
                    return false;
                }
//配置一个透明的询问框
                layer.msg('', {
                    time: 3000, //20s后自动关闭
                    offset: 't',
                    content:'<input type="hidden" name="p_id" value="'+data.id+'">',
                    btn: btns,
                    //查看字段
                    yes: function(index, layero){
                        //layer.msg('字段'+data.id)
                        var index = layer.open({
                            title:data.r_cn_name,
                            type: 2,
                            content: '/html/resource/resource_detail_list.html?id='+data.id,
                            area: ['100%', '100%'],
                            maxmin: false
                        });
                    },
                    //发布或者重发
                    btn2: function(index, layero){
                        //layer.msg('发布/重发')
                        if(data.r_status == 'wait_issue'){
                            $.ajax({
                                url:"/dbm/resource/issue",
                                type:"post",
                                data:{resource_id:data.id},
                                async:false,
                                success:function (data) {
                                    if(data.success){
                                        layer.msg("发布成功")
                                        query();
                                    }else {
                                        layer.msg(data.message)
                                    }
                                }
                            })
                        }else {
                            $.ajax({
                                url:"/dbm/resource/re_issue",
                                type:"post",
                                data:{resource_id:data.id},
                                async:false,
                                success:function (data) {
                                    if(data.success){
                                        layer.msg("重新发布成功")
                                        query();
                                    }else {
                                        layer.msg(data.message)
                                    }
                                }
                            })
                        }
                    },
                    //编辑表名
                    btn3: function(index, layero){
                        //按钮【按钮三】的回调
                        //layer.msg('改')
                        var index = layer.open({
                            title:data.r_cn_name,
                            type: 2,
                            content: '/html/resource/resource_from.html?id='+data.id,
                            area: ['100%', '100%'],
                            maxmin: false
                        });
                    },
                    //删除表
                    btn4: function(index, layero){
                        //按钮【按钮三】的回调
                        //layer.msg('删')
                        layer.confirm('删除资源后无法恢复，继续？', function(index){
                        $.ajax({
                            url:"/layui/table/delete",
                            type:"post",
                            data:{id:data.id,resource_name:"resources_info"},
                            async:false,
                            success:function (data) {
                                if(data.success){
                                    layer.msg("删除成功")
                                    obj.del(); //删除对应行（tr）的DOM结构
                                }else {
                                    layer.msg(data.message)

                                }
                            }
                        })
                        layer.close(index);
                    //向服务端发送删除指令
                });
                    },
                    //浏览数据
                    btn5: function(index, layero){
                        //按钮【按钮三】的回调
                        //layer.msg('浏览')
                        var index = layer.open({
                        title:data.r_cn_name,
                        type: 2,
                        content: '/html/data/data_list.html?id='+data.id+"&resource_name="+data.r_name,
                        area: ['100%', '100%'],
                        maxmin: false
                });
                    }
                });

            }

        });
    });
    //layui 上传
    layui.use('upload', function() {
        var $ = layui.jquery
                , upload = layui.upload;
        //拖拽上传
        upload.render({
            elem: '#upload',
            url: '/dbm/resource/upload',
            accept: 'file', //普通文件
            exts: 'xls|xlsx', //只允许上传excl文件
            done: function(res){
                if(res.success){
                    layer.msg(res.message);
                    query();
                }else {
                    layer.msg(res.message,{time:8000});
                }

            }
        });
    });

    //编辑后 不刷新 更新选中数据
     function renovation (data) {
         var b=false;
         if(data.id){
             for(var key in data){
                 $(".layui-table-click td[data-field='"+key+"'] div").html(data[key])
             }
         }else {
             query();
         }
         layer.msg("提交成功",{time:5000})
    }
    //查询
    $("#search").click(function () {
        query();
    })
    //新增
    $(".add").click(function () {
        save();
    })
    //todo 导出
    $(".export").click(function () {
        window.location.href='/dbm/resource/exprot';
    })
    //保存共用方法
    function save (id) {
        id=(id==undefined)?(""):("?id="+id);
        var index = layer.open({
            type: 2,
            content: '/html/resource/resource_from.html'+id,
            area: ['100%', '100%'],
            maxmin: false
        });
        layer.full(index);
    }
    //查询共用方法
    function query () {
        var table = layui.table;
        table.reload('idTest', {
            where: {content: $("#content").val()}
        });
    }
</script>
</body>
</html>